@namespace SwashbucklerDiary.Rcl.Components
@inherits DialogComponentBase

<MultiSizeDisplay>
    <MobileContent>
        <CustomMBottomSheet MyValue="Visible"
                            MyValueChanged="InternalVisibleChanged"
                            ContentClass="rounded-t-lg"
                            OnBeforeShowContent="HandleBeforeShowContent">
            @GenCard(GenMobileCardActionsContent())
        </CustomMBottomSheet>
    </MobileContent>
    <DesktopContent>
        <CustomMDialog MyValue="Visible"
                       MyValueChanged="InternalVisibleChanged"
                       ContentClass="rounded-lg"
                       MaxWidth="420"
                       OnBeforeShowContent="HandleBeforeShowContent">
            @GenCard(GenDesktopCardActionsContent())
        </CustomMDialog>
    </DesktopContent>
</MultiSizeDisplay>

@code {
    private RenderFragment GenCard(RenderFragment cardActionsContent) => __builder =>
    {
        <MCard Class="rounded-t-lg">
            <MCardTitle Class="font-weight-bold flex-nowrap">
                <wc-auto-scroll-text>@(I18n.T("Select file types"))</wc-auto-scroll-text>
                <MSpacer></MSpacer>
                <MButton Icon="true"
                         OnClick="HandleOnCancel">
                    <MIcon>close</MIcon>
                </MButton>
            </MCardTitle>
            <MCardText Class="pb-0 px-0">
                <MList Class="py-0">
                    @foreach (var item in items)
                    {
                        <MListItem Class="px-10"
                                   OnClick="@item.OnClick">
                            <MListItemIcon>
                                <MIcon>
                                    @(item.Icon)
                                </MIcon>
                            </MListItemIcon>
                            <MListItemContent>
                                <MListItemTitle>
                                    <wc-auto-scroll-text>@(I18n.T(item.Text))</wc-auto-scroll-text>
                                </MListItemTitle>
                            </MListItemContent>
                            <MListItemAction>
                                @if (internalValue.Contains(item.Value))
                                {
                                    <MIcon>
                                        check
                                    </MIcon>
                                }
                            </MListItemAction>
                        </MListItem>
                    }
                </MList>
            </MCardText>
            <MCardActions>
                @cardActionsContent
            </MCardActions>
        </MCard>
    };

    private RenderFragment GenMobileCardActionsContent() => __builder =>
    {
        <MButton Class="text-subtitle-1 flex-grow-1 mb-2"
                 Style="flex-basis:0;"
                 Rounded="true"
                 Depressed="true"
                 Large="true"
                 Color="rgba(var(--m-theme-surface-container-high))"
                 OnClick="HandleOnCancel">
            @(I18n.T("Cancel"))
        </MButton>
        <MButton Class="text-subtitle-1 flex-grow-1 mb-2"
                 Style="flex-basis:0;"
                 Rounded="true"
                 Depressed="true"
                 Large="true"
                 Color="rgba(var(--m-theme-surface-container-high))"
                 OnClick="HandleOnOK">
            @(I18n.T("OK"))
        </MButton>
    };

    private RenderFragment GenDesktopCardActionsContent() => __builder =>
    {
        <MSpacer></MSpacer>
        <MButton Text="true"
                 OnClick="HandleOnCancel">
            @(I18n.T("Cancel"))
        </MButton>
        <MButton Text="true"
                 Color="primary"
                 OnClick="HandleOnOK">
            @(I18n.T("OK"))
        </MButton>
    };
}